<template>
    <div class="table">
      <div class="crumbs">
            <el-breadcrumb separator="/">
                <el-breadcrumb-item>
                  <span class="container-title-p">
                    BTM机器管理
                    <i class="iconfont icon-jiantou"></i>
                  </span>
                  <span>设备提醒</span>
                  </el-breadcrumb-item>
            </el-breadcrumb>
        </div>
        <div class="handle-box">
            <el-select placeholder="选择告警类型" v-model='params.type' size='small'>
                <el-option label='所有告警' value=""></el-option>
                <el-option label='存款箱告警' value="0"></el-option>
                <el-option label='取款箱告警' value="1"></el-option>
                <el-option label='设备异常警告' value="2"></el-option>
            </el-select>
            <el-button icon="el-icon-search" type='success' size='small' @click='getList'>搜索</el-button>
        </div>
        <br>
        <div class="handle-box">
            <el-table :data='alarmData'>
                <el-table-column prop="id" label="编号" align="center">
                </el-table-column>
                <el-table-column prop="type" label="提醒类型" align="center">
                    <template slot-scope="scope">
                        {{scope.row.type==0?'存款箱告警':'取款箱告警'}}
                    </template>
                </el-table-column>
                <el-table-column prop="btm.code" label="设备编号" align="center">
                </el-table-column>
                <el-table-column prop="createTime" label="时间" align="center">
                </el-table-column>
                <el-table-column label="操作" align="center">
                    <template slot-scope="scope">
                        <el-button type='success' size="small" @click='logDetail(scope.row)'>查看详情</el-button>
                    </template>
                </el-table-column>
            </el-table>
            <div class="pagination">
                <el-pagination
                    :page-size="params.size"
                    @current-change ="handleCurrentChange"
                    layout="prev, pager, next"
                    :total="all_page">
                </el-pagination>
            </div>
        </div>
        <loading v-if='loading' :tip='tip'></loading>
    </div>
</template>
<script>
    import loading from '@/components/common/loading.vue';
    import {api,apiGet,apiPut,apiPatch} from '@/api/index';
    export default {
        data(){
            return {
                loading:false,
                tip:'',
                params:{
                    page:0,
                    size:5,
                    type:'',
                },
                alarmData:[{
                    btm:{},
                }],
                all_page:5,
            }
        },
        components:{
            loading
        },
        methods: {
            getList(){
                this.loading=true;
                this.tip='获取警告列表';
                apiPatch.drive.alarmLog('',this.params).then(res=>{
                    //console.log(res);
                    this.loading=false;
                    this.alarmData=res.content;
                    this.all_page=res.totalElements;

                })
            },
            logDetail(row){
                this.$router.push({path:'/deviceAlarms',query:{
                    content:row.content,
                    id:row.btm.id,
                }});
            },
            handleCurrentChange(val){
                this.params.page=val-1;
            }
        },
        mounted () {
            this.getList();
        },
    }
</script>
<style scoped>

</style>
